<div class="submitImg">
	<p class="ImgName">立体图<span class="ImgText">（建议以jpg、bmp、dwg、压缩包格式上传，要求图片清晰，内容真实，大小控制在10MB内）</span></p>
	<hr />
	<div class="submitImgText">
		<div class="imgBtn" id="space">
			<img src="/ceca_two/img/plus_film.png" alt="" />
			<p>上传文件</p>
		</div>
		<div id="thelistSpace" class="ImgList"></div>
	</div>
</div>
</span>  
<script type="text/javascript" src="/ceca_two/js/costnorm/webuploader.js"></script>
<script type="text/javascript">
$(function(){
	var $list=$("#thelistSpace");
	var thumbnailWidth = 287; 
	var thumbnailHeight = 216;
	var uploaderSpace = WebUploader.create({  
       // 选完文件后，是否自动上传。  
       auto: true,  
       // swf文件路径  
       swf: '/ceca_two/js/costnorm/Uploader.swf',  
  
       // 文件接收服务端。  
       server: '/api/upload/add',
  
       // 选择文件的按钮。可选。  
       // 内部根据当前运行是创建，可能是input元素，也可能是flash.  
       pick: '#space',  
  
       // 只允许选择图片文件。  
//     accept: {  
//         title: 'Images',  
//         extensions: 'gif,jpg,jpeg,bmp,png',  
//         mimeTypes: 'image/*'  
//     },  
       method:'POST',  
   });  
   uploaderSpace.on( 'fileQueued', function( file ) {
    var $li = $(
            '<div id="' + file.id + '" class="file-item thumbnail">' +
                '<img>' +
                '<div class="info">' + file.name + '</div>' +
                '<div class="delImg" >'+
                	'<span title="删除"><i>删除文件</i></span>'+
                '</div>'+
            '</div>'
            ),
        $img = $li.find('img');

    // $list为容器jQuery实例
    $list.append( $li );
    	$(".thumbnail").hover(function(){
		$(this).find(".delImg").show().find("span").click(function(){
			$(this).parents(".thumbnail").remove();
		});
	},function(){
		$(this).find(".delImg").hide();
	});
//  // 创建缩略图
//  // 如果为非图片文件，可以不用调用此方法。
//  // thumbnailWidth x thumbnailHeight 为 100 x 100
    uploaderSpace.makeThumb( file, function( error, src ) {
        if ( error ) {
            $img.replaceWith('<span>不能预览</span>');
            return;
        }

	        $img.attr( 'src', src );
	    }, thumbnailWidth, thumbnailHeight );
	});
//	uploader.on( 'uploadProgress', function( file, percentage ) {
//	    var $li = $( '#'+file.id ),
//	        $percent = $li.find('.progress span');
//	
//	    // 避免重复创建
//	    if ( !$percent.length ) {
//	        $percent = $('<p class="progress"><span></span></p>')
//	                .appendTo( $li )
//	                .find('span');
//	    }
//	
//	    $percent.css( 'width', percentage * 100 + '%' );
//	});
//	
	// 文件上传成功，给item添加成功class, 用样式标记上传成功。
	uploaderSpace.on( 'uploadSuccess', function( file ) {
	   // $( '#'+file.id ).addClass('upload-state-done');
	});
	
//	// 文件上传失败，显示上传出错。
//	uploader.on( 'uploadError', function( file ) {
//	    var $li = $( '#'+file.id ),
//	        $error = $li.find('div.error');
//	
//	    // 避免重复创建
//	    if ( !$error.length ) {
//	        $error = $('<div class="error"></div>').appendTo( $li );
//	    }
//	
//	    $error.text('上传失败');
//	});
	
	// 完成上传完了，成功或者失败，先删除进度条。
//	uploader.on( 'uploadComplete', function( file ) {
//	    $( '#'+file.id ).find('.progress').remove();
//	});
});
</script>